<!--
 * @Descripttion: 
 * @Version: 
 * @Author: gaohj
 * @Date: 2022-10-27 14:13:36
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2022-10-27 14:51:34
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // https://img-blog.csdnimg.cn/20200426145448155.gif
        var arr1 = [9, 3, 6, 10, 2, 5, 11, 4, 1, 7];
        document.write('原始', arr1, '<br>');

        // 拿数组内的第一个元素跟后一个元素比较,如果大于后一个元素
        // 然后交换位置 一致到最后 一轮下来 最大值一定到最右边  

        // 这一轮不是最终的结果 
        // 需要好几轮才可以  


        // 一轮 比较好几次 
        // 需要好几轮  

        // 一轮最多比较多少次  length - 1 次
        // 最多length -1    轮  

        // 需要嵌套循环  外边控制几轮
        // 里边控制 每一轮多少次 

        // var tmp = arr1[0];
        // arr1[0] = arr1[1];
        // arr1[1] = tmp;


        // arr1.length; 10 
        // 0 ~ 9 
        // arr1[i]  arr1[i+1]
        // 0 1 2 3 4 5 6 7 8 
        // 1 2 3 4 5 6 7 8 9 


        // 第一轮的比较  

        for (var i = 0; i < arr1.length - 1; i++) {
            if (arr1[i] > arr1[i + 1]) {
                var tmp = arr1[i];
                arr1[i] = arr1[i + 1];
                arr1[i + 1] = tmp;
            }
        }

        document.write('一轮以后:', arr1,'<br />');



        // i = 0   趟    length - 1次     少 0 次 
        // i = 1         length - 1 -1    少1 次
        // i = 2         length - 1 -1 -1 少2次
        // i = 3         length - 1 -1 -1 -1  少3次


        for (var i = 0; i < arr1.length - 1; i++) {
            for (var j = 0; j < arr1.length - 1 - i; j++) {
                if (arr1[j] > arr1[j + 1]) {
                    var tmp = arr1[j];
                    arr1[j] = arr1[j + 1];
                    arr1[j + 1] = tmp;
                }
            }
            document.write(i+'轮以后:', arr1,'<br />');
        }

        document.write('最后:', arr1);


        // 双层for循环 一层少一次  
        // 里层减外层  变量想交换  
    </script>
</body>

</html>